
﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>FogTime</title>

<link rel="stylesheet" href="themes/css/jqtouch.css" title="jQTouch">
<style type="text/css" media="screen">@import "themes/css/jqtouch.css";</style>
<script src="src/lib/zepto.min.js" type="text/javascript" charset="utf-8"></script>
<script src="src/jqtouch.min.js" type="text/javascript" charset="utf-8"></script>

<script src="lib/fogtime.js" type="text/javascript" charset="utf-8"></script>
<script src="extensions/jqt.themeswitcher.min.js" type="application/x-javascript" charset="utf-8"></script>

        <script type="text/javascript" charset="utf-8">
            var jQT = new $.jQTouch({
                icon: 'jqtouch.png',
                icon4: 'jqtouch4.png',
                addGlossToIcon: false,
                startupScreen: 'jqt_startup.png',
                statusBar: 'black-translucent',
                themeSelectionSelector: '#jqt #themes ul',
                preloadImages: []
            });
        </script>
        <style type="text/css" media="screen">
            #jqt.fullscreen #home .info {
                display: none;
            }
            div#jqt #about {
                padding: 100px 10px 40px;
                text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0;
                color: #999;
                font-size: 13px;
                text-align: center;
                background: #161618;
            }
            div#jqt #about p {
                margin-bottom: 8px;
            }
            div#jqt #about a {
                color: #fff;
                font-weight: bold;
                text-decoration: none;
            }
        </style>

</head>

<body onload="javascript:loadCases(3,'#quickStart');">
	<div id="jqt">
        <div id="about" class="selectable">
                <p><strong>FogTime</strong><br>Version 1.0 beta<br>
                    <a href="#">WeisLabs</a></p>
                <p><em>Easily and quickly track time against your FogBugz cases.</em></p>
                <p><br><br><a href="#" class="grayButton goback">Close</a></p>
        </div>
        <div id="home" class="current">
            <div class="toolbar">
                <h1>FogTime</h1>
                <a class="button slideup" id="infoButton" href="#about">About</a>
            </div>
            <div class="scroll" id="top">
                <div id="result" class="info"><p>Easily and quickly track time against your FogBugz cases.</p></div>
                <div id="ajax" style="display:none;"></div>
                
                <h2>Quick Start</h2>
                <ul class="rounded" id="quickStart">
                	<li>Loading Cases...</li>
                </ul>
                <h2>Start Work</h2>
                <ul class="rounded">
                	<li class="arrow"><a href="#timer" onclick="javascript:quickStart('???');">Start a Timer</a></li>
                	<li class="arrow"><a href="#logtime">Log time</a></li>
                </ul>
                <ul class="individual">
                    <li><a href="#home" class="dissolve" onclick="javascript:stopWorking();">Stop Working</a></li>
                    <li><a href="#settings" class="flip">Settings</a></li>
                </ul>
            </div>
        </div>
        <div id="timer">
            <div class="toolbar">
                <h1>Start a Timer</h1>
                <a href="#home" class="back">Cancel</a>
            </div>
            <div class="scroll">
            	<div class="info" id="txtTimer"><p>Timer Started</p></div>
            	<input type="hidden" id="timerStart" name="TimerStart" />
            	<input type="hidden" id="timerStop" name="timerStop" />
                <ul class="rounded">
                	<li class="arrow"><a href="#manual">Enter a case number <small id="timerix" class="counter">???</small></a></li>
                </ul>
                
                <a href="#home" class="greenButton dissolve" onclick="javascript:saveTimer();">Stop & Save Timer</a>
                <br />
                
                <h2>Choose a Case</h2>
                <ul class="rounded" id="chooseCase">
                	<li>Loading Cases...</li>
                </ul>
            </div>
        </div>
        <div id="manual">
            <div class="toolbar">
                <h1>Enter a Case</h1>
                <a href="#" class="back">Back</a>
            </div>
            <div class="scroll">
                <ul class="edit rounded">
                    <li><input type="text" name="enterix" placeholder="Case Number" id="enterix" /></li>
                </ul>
                <a href="#timer" class="grayButton slideright" onclick="javascript:setTimerIx();">Use Case</a>
            </div>
        </div>
        <div id="logtime">
            <div class="toolbar">
                <h1>Log Time</h1>
                <a href="#" class="back">Home</a>
            </div>
            <div class="scroll">
                <ul class="rounded">
                	<li class="arrow"><a href="#">Item 1</a></li>
                	<li class="arrow"><a href="#">Item 2</a></li>
                </ul>
            </div>
        </div>
        <div id="settings">
            <div class="toolbar">
                <h1>Settings</h1>
                <a href="#" class="back">Home</a>
            </div>
            <div class="scroll">
                <ul class="rounded">
                	<li class="arrow"><a href="#">Item 1</a></li>
                	<li class="arrow"><a href="#">Item 2</a></li>
                </ul>
            </div>
        </div>
	</div>
	
	

</body>

</html>